<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>课程详情</title>
	</head>
	<body class="detail">
		<main class="main">
			<!-- 视屏播放 -->
			<div class="back">&lt;</div>
			<div class="video">
				<div id="videoBtn">
					<span id="end" class="iconfont icon-24gf-pause2 play"></span>
					<span id="plays" class="iconfont icon-bofang play"></span>
					视屏预览
				</div>
				<video
					src="http://fitness.h5.itsource.cn:3701/course/part1.mp4"
					id="video"
					muted
				></video>
			</div>
			<section class="detail-text">
				<h3 id="title">标题</h3>
				<!-- 运动数据 -->
				<div class="detail-data">
					<p>
						<span id="calorie">45</span>
						千卡
					</p>
					<p>
						<span id="time">15</span>
						分钟
					</p>
					<p><span id="peoplenum">99.99</span> w人练过&gt;</p>
				</div>
				<!-- 用户信息栏 -->
				<div class="user-info">
					<div class="info">
						<img src="../../assets/images/dog.jpg" />
						<div>
							<h4>用户名</h4>
							<span>三线达人课程设计师</span>
						</div>
					</div>
					<p>+关注</p>
				</div>
				<!-- 课程介绍 -->
				<p class="introduce">
					15分钟带你雕刻出性感的巧克力腹肌,对腹肌进行全方位的刺激,泵感十足!型男必备...
					<span>更多</span>
				</p>
				<!-- 训练数据 -->
				<div class="train-data">
					<div class="train-num">
						<span class="iconfont icon-guizi-cabinet1 play"></span>
						训练频次
						<p>每周3-5次</p>
					</div>
					<div class="tool">
						<span class="iconfont icon-yaling"></span>
						机械
						<p>无</p>
					</div>
				</div>
			</section>
		</main>
		<!-- 开始训练 -->
		<a href="sports_course_play.html" class="playBtn">开始训练</a>
	</body>
</html>
